<template>
  <view class="index_title">
    <text class="left"></text>
    <text class="title1">{{ title1 }}</text>
    <text class="title2">{{ title2 }}</text>
  </view>
</template>

<script>
export default {
  name: "IndexTitle",
  props: {
    title1: {
      type: String,
      default: "",
    },
    title2: {
      type: String,
      default: "",
    },
  },
  data() {
    return {};
  },
};
</script>

<style lang="scss">
.index_title {
  width: 100%;
    height: 70rpx;
    display: flex;
    margin: 60rpx 0 30rpx 0;
    color: #333;
    font-size: 44rpx;

  .left {
    display: inline-block;
    width: 12rpx;
    height: 100%;
    background: #48bc42;
    border-radius: 46rpx 46rpx 46rpx 46rpx;
  }
  .title1 {
    display: inline-block;
    height: 70rpx;
    margin: 0 20rpx 0 32rpx;
  }
  .title2 {
    font-size: 24rpx;
    height: 70rpx;
    line-height: 70rpx;
  }
}
</style>
